<section class="header">
  <div class="pull-left">
    <h1>
      {{t "userPreferencesPage.header"}}
    </h1>
  </div>
</section>
<section class="row">
  <div class="col span-11-of-23 mt-0 mb-0">
    {{settings/theme-toggle}}
    <hr class="mt-20 mb-20" />
    {{settings/table-rows}}
  </div>
  <div class="col offset-1-of-23 span-11-of-23 mt-0 mb-0">
    <h2>
      {{t "userPreferencesPage.generalInfo.header"}}
    </h2>
    <div class="box">
      <div class="row">
        <div class="col span-6">
          <label class="acc-label">
            {{t "userPreferencesPage.generalInfo.name.label"}}
          </label>
          {{input-or-display
            editable=false
            value=model.account.name
          }}
        </div>
        <div class="col span-6">
          <label class="acc-label">
            {{t "userPreferencesPage.generalInfo.username.label"}}
          </label>
          {{input-or-display
            editable=false
            value=model.account.username
          }}
        </div>
      </div>
      <div class="row mt-20">
        <div class="col span-12 text-center">
          <button class="btn bg-primary" type="button" {{action "editPassword" }}>
            {{t "userPreferencesPage.generalInfo.password.text"}}
          </button>
        </div>
      </div>
    </div>
  </div>
</section>
